<template>
  <website-footer>
    <template #up>
      <div class="footerUp">
        <div>{{ $t('website_footer.up.field1') }}</div>
        <div>{{ $t('website_footer.up.field2') }}</div>
        <div>{{ $t('website_footer.up.field3') }}</div>
      </div>
    </template>
    <template #down>
      <div class="footerDown">
        {{ $t('website_footer.down.field') }}
      </div>
    </template>
  </website-footer>
</template>

<script setup>
import { defineComponent } from 'vue'
import WebsiteFooter from '../common/WebsiteFooter.vue'

defineComponent({
	name: 'PublicWebsiteFooter'
})
</script>

<style scoped lang="scss">
.footerUp {
	display: flex;
	flex-direction: row;
	justify-content: space-evenly;
	color: rgba(0, 0, 0, 0.4470588235294118);
	margin-top: 50px;
}
.footerDown {
	color: #bdbaba;
	margin-top: 30px;
	margin-bottom: 15px;
}
</style>
